<!--
 * @author luguoxiang
 * @date 2022/9/17
 * 开源项目：https://gitee.com/lgx1992/lg-soar 求star！请给我star！请帮我点个star！
-->
<template>
  <t-checkbox-group v-bind="$attrs">
    <t-checkbox v-for="x in props.list" :key="x.id" :value="x.id">
      <t-avatar :image="getFileAccessAuthUrl(x.avatar)" :hide-on-load-failed="false">
        {{ x.name.substring(x.name.length - 2) }}
      </t-avatar>
      {{ x.name }}
      <span class="gl-color-placeholder">（{{ x.other }}）</span>
    </t-checkbox>
  </t-checkbox-group>
</template>

<script setup lang="ts">
import { getFileAccessAuthUrl } from '@/soar';

const props = defineProps({
  list: {
    type: Array,
  },
});
</script>
<style lang="less" scoped>
.t-checkbox-group {
  width: 100%;
  gap: var(--app-space-vertical) 0;
  .t-checkbox {
    width: 100%;
    padding-left: var(--td-comp-paddingTB-xxs);
    &:hover {
      background: var(--td-bg-color-container-hover);
    }
  }
}
</style>
